<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="X-UA-Compatible" content="IE=Edge">
	<meta charset="UTF-8">
	<title>公众帐号</title>
	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, target-densitydpi=medium-dpi" />
	<meta name="format-detection" content="telephone=no" />
	<meta name="apple-mobile-web-app-capable" content="yes" />
	<!-- <link href="css/main.css" rel="stylesheet" type="text/css" /> -->
	<style type="text/css">
	#l{
		background: green;
	}
	#l.selected{
		background: red;
	}
	</style>

</head>
	<body style="width:5000px;height:8000px;">
		<div id="l" style="width:300px;height:300px;"></div>
		<input />
		<div id="o">

		</div>
		<script type="text/javascript" src="js/JM.js"></script>
		<script type="text/javascript">
		JM.event.on(window,"ortchange",function(e){
			alert("g");
			JM.dom.id("o").innerHTML = e.orientation;
		});
		function testFixed(){
  			var container = document.body;
  
		  if (document.createElement && container && container.appendChild && container.removeChild) {
		    var el = document.createElement('div');
		    
		    if (!el.getBoundingClientRect) return null;
		        
		    el.innerHTML = 'x';
		    el.style.cssText = 'position:fixed;top:100px;';
		    container.appendChild(el);

		    var originalHeight = container.style.height,
		        originalScrollTop = container.scrollTop;

		    container.style.height = '3000px';
		    container.scrollTop = 500;

		    var elementTop = el.getBoundingClientRect().top;
		    container.style.height = originalHeight;
		    
		    var isSupported = (elementTop === 100);
		    container.removeChild(el);
		    container.scrollTop = originalScrollTop;

		    return isSupported;
		  }
		  return null;
		}
		
		// JM.event.on(window,"scroll",function(e){
		// 	alert("d");
		// });
		// alert(J.support.fixed);
		JM.Util.fixElement(JM.dom.id("l"),{
			top:120,
			left:120
		});

		JM.Util.hoverEffect(JM.dom.id("l"),"selected");
			
		</script>
	</body>
</html>